<template lang="html">
  <sui-container>
    <sui-table color="red">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="orange">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="yellow">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="olive">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="green">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="teal">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="blue">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="violet">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="purple">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="pink">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="grey">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
    <sui-table color="black">
      <sui-table-header>
        <sui-table-row>
          <sui-table-header-cell>Food</sui-table-header-cell>
          <sui-table-header-cell>Calories</sui-table-header-cell>
          <sui-table-header-cell>Protein</sui-table-header-cell>
        </sui-table-row>
      </sui-table-header>
      <sui-table-body>
        <sui-table-row>
          <sui-table-cell>Apples</sui-table-cell>
          <sui-table-cell>200</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
        <sui-table-row>
          <sui-table-cell>Orange</sui-table-cell>
          <sui-table-cell>310</sui-table-cell>
          <sui-table-cell>0g</sui-table-cell>
        </sui-table-row>
      </sui-table-body>
    </sui-table>
  </sui-container>
</template>

<script>
export default {
  name: 'TableColoredExample',
};
</script>
